<extend name="Public/common"/>
<block name="othercss">
    <style>
        body {
            background: rgb(248, 248, 248);
        }

        .card-bg {
            display: flex;
            flex-direction: column;
            justify-content: center;
            width: 356px;
            height: 118px;
            background: #FFF;
            margin: auto;
            margin-top: 24px;
        }

        .card-bg-to {
            width: 347px;
            height: 108px;
            border: 2px solid rgb(209, 0, 21);
            margin: auto;
            display: flex;
            flex-direction: row;
        }

        .card-left {
            margin: 11px 0;
            width: 102px;
            border-right: 1px dashed rgb(181, 181, 181);
            text-align: center;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .card-right {
            width: 245px;
            padding: 11px;
            padding-right: 7px;
            color: rgb(159, 159, 159);
        }

        .card-bottom {
            font-size: 10px;
            margin-top: 10px;
            display: flex;
            flex-direction: row;
            justify-content: space-between;

        }

        .card-btn {

            width: 71px;
            text-align: center;
            height: 20px;
            line-height: 20px;
            border-radius: 5px;
            color: #FFF;
            background: rgb(209, 0, 21);
        }
    </style>
</block>
<block name="header">
    <div class="header">
        <div class="clearfix box">
            <a class="return" href="javascript:history.back(-1)"><i class="return-icon"></i></a>
            <h2>领取优惠券</h2>
        </div>
    </div>
</block>
<block name="body">
    <!-- 优惠券开始 -->
    <div class="container pt50 content">
        <!-- 卡片背景 -->
        <div class="card-bg">
            <div class="card-bg-to">
                <div class="card-left">
                    <span style="font-size:33px;color:rgb(209,0,21);font-weight: bold;"><a
                            style="font-size:20px;color:rgb(209,0,21);font-weight: bold;">￥</a>{$ex_register}</span>
                </div>
                <div class="card-right">
                    <p style="font-size:15px;font-weight: bold;color: #000">代理尊享券</p>
                    <p style="font-size:10px;margin-top:5px;">{$start} - {$end}</p>
                    <p style="font-size:10px;">任意商品都可以使用</p>
                    <div class="card-bottom" style="color: grey">当前有效
                        <a onclick="push(this)" class="card-btn">立即领取</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</block>
<block name="footer">
    <script>
        function push (obj) {
            $.post('/Phone/Extension/pullCoupon',function (e) {
                if (e) {
                    obj.setAttribute('style', 'background-color: #D1D1D1');
                    layer.msg('领取成功');
                    setTimeout(function () {
                        window.location.href = '/Phone/Extension/profitIndex';
                    },1000)
                }
            })
        }
    </script>
</block>

